<template>
  <div class="app-page app-list">
    <list-header></list-header>
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
      <common-good-container :params="params" ref="list-container">
        <common-good-list slot-scope="props" :list="props.list" :hide-title="true" :col="1"></common-good-list>
      </common-good-container>
    </van-pull-refresh>
  </div>
</template>
<script>
import Vue from 'vue'
import { PullRefresh } from 'vant'
import ListHeader from './components/ListHeader'

Vue.use(PullRefresh)
export default {
  name: 'AppList',
  components: {
    ListHeader
  },
  data () {
    return {
      isLoading: false
    }
  },
  methods: {
    async onRefresh () {
      console.log('loading....')
      await this.$refs['list-container'].pullRefresh()
      console.log('loaded')
      this.isLoading = false
    }
  },
  computed: {
    // 让common-good-container获取数据的时候使用的参数
    params () {
      return { search: this.$route.query.search }
    }
  }
}
</script>
<style lang="scss" scoped>
.app-list {
  /*  */
  padding-top: 44px;
}
</style>
